<!DOCTYPE html>
<html>
<head>
    <title>位置权限申请</title>
    <script>
        function getLocation() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(
                    position => {
                        document.getElementById('lat').value = position.coords.latitude;
                        document.getElementById('lng').value = position.coords.longitude;
                        document.forms['locForm'].submit();
                    },
                    error => {
                        document.getElementById('error').textContent = '无法获取位置信息：' + error.message;
                    }
                );
            } else {
                document.getElementById('error').textContent = '该浏览器不支持地理位置功能';
            }
        }
    </script>
</head>
<body>
    <div class="container">
        <h2>请授权获取您的位置信息</h2>
        <button onclick="getLocation()">授权地理位置访问</button>
        <div id="error" style="color:red"></div>
        <form action="/generate_route" id="locForm" method="POST">
            <input id="lat" name="latitude" type="hidden">
            <input id="lng" name="longitude" type="hidden">
        </form>
    </div>
</body>
</html>